<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>订单详情 - 茶品商城</title>
    <link rel="stylesheet" href="css/style.css">
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
    <nav class="header">
        <div class="nav-container">
            <h1 class="logo">茶韵小铺</h1>
            <div class="nav-links">
                <a href="/index.jsp">首页</a>
                <a href="/cart.jsp">购物车</a>
                <a href="/order.jsp">订单</a>
                <a href="/payment.jsp">支付</a>
            </div>
        </div>
    </nav>
    <div class="container">
        <h1>订单信息</h1>
        <p>订单号：${order.orderId}</p>
        <p>下单时间：${order.createTime}</p>
        <table class="order-table">
            <thead>
                <tr>
                    <th>商品</th>
                    <th>价格</th>
                    <th>数量</th>
                    <th>小计</th>
                </tr>
            </thead>
            <tbody>
                <c:forEach items="${order.items}" var="item">
                    <tr>
                        <td class="product-cell">
                            <img src="${item.mainImage}" alt="${item.productName}" class="order-image">
                            ${item.productName}
                        </td>
                        <td>￥${item.price}</td>
                        <td>${item.quantity}</td>
                        <td>￥${item.price * item.quantity}</td>
                    </tr>
                </c:forEach>
            </tbody>
        </table>
        <p class="total-price">总金额：￥${order.totalPrice}</p>
        <form action="/payment" method="post" class="payment-form">
            <input type="hidden" name="orderId" value="${order.orderId}">
            <button type="submit" class="btn btn-primary">立即支付</button>
        </form>
        <a href="/" class="back-link">返回首页</a>
    </div>
</body>
</html>